<template>
	<div style="height:calc(100vh - 94px);background-color:#FFFFFF;overflow-y:auto;">
		<pheader style="border-bottom: 1px solid #dcdae2; ">
			<div  slot="left">业务系统配置</div>
			<div style="float:right;margin-right: 20px;position: relative;font-weight: normal;" slot="right">
				<Row>
					<Col span="4">
						<Button type="primary" size="small" @click="add()" v-if="this.$hasPerm('sysAddue')">新增</Button>
					</Col>
					<Col span="10">
						<Select v-model="checkType" :transfer='true'  @on-change="searchType" >
							<Option value="">全部</Option>
							<Option v-for="item in sysIsList" :value="item.Type" :key="item.Type">{{item.name}}</Option>
						</Select>
					</Col>
					<Col span="10" style="padding-left:12px">
						<Input v-model="search_param" search placeholder="请输入系统名称" style="width: auto;" @on-search="changePage($event,0)" />
					</Col>
				</Row>
				
			</div>
		</pheader>
		<template style="padding: 8px 8px 0px 8px;">
			<div style="width: 100%;background-color: white;height: calc(100vh - 152px);overflow-y: auto;padding:10px;">

				<Table border stripe :columns="columns" :data="data">
					<template slot-scope=" { row, index }" slot="sysIs">
						<p v-if="row.is4account == 1">账号申请</p>
						<p v-if="row.is4net == 1">网络策略</p>
						<p v-if="row.is4paas == 1">入驻工单/PaaS</p>
						<p v-if="row.is4resource == 1">关联资源/PaaS</p>
						<p v-if="row.is4superAcc == 1">最高权限申请</p>
					</template>					
					<template slot-scope=" { row, index }" slot="depId">
						<div v-for="item in depList"  :key="item.id">
							<p v-if="row.depId === item.id">{{item.depName}}</p>
						</div>
					</template>
					<template slot-scope=" { row, index }" slot="businessUser">
						<p v-if="row.businessUser != null">{{row.businessUser.user_name}}</p>
					</template>
					<template slot-scope=" { row, index }" slot="amUser">
						<p v-if="row.amUser != null">{{row.amUser.user_name}}</p>
					</template>
					<template slot-scope=" { row, index }" slot="dbAmUser">
						<p v-if="row.dbAmUser != null">{{row.dbAmUser.user_name}}</p>
					</template>
					<template slot-scope=" { row, index }" slot="hadoopAmUser">
						<p v-if="row.hadoopAmUser != null">{{row.hadoopAmUser.user_name}}</p>
					</template>
					<template slot-scope=" { row, index }" slot="serverAmUser">
						<p v-if="row.serverAmUser != null">{{row.serverAmUser.user_name}}</p>
					</template>
				</Table>

				<div style="margin: 10px;overflow: hidden">
					<div style="float: right;">
						<Page :current="page" :total="total_num" show-total show-elevator show-sizer @on-change="changePage"
						 @on-page-size-change="changePageSize"></Page>
					</div>
				</div>

				<div v-if="add_menu.show">
					<Modal @on-ok="add_ok()" @on-cancel="cancel('add_menu')" v-model="add_menu.show" :loading="loading" :title="!add_menu.isupdate?'新增系统':'编辑系统'"
					 width="600">
						<Form ref="add_menu" :model="add_menu" :rules="ruleInline" label-position="left" :label-width="100">
							<Row >
								<Col span="14" >
								<FormItem label="系统名称：" prop="sysName">
									<Input v-model="add_menu.sysName" :maxlength="50" />
								</FormItem>
								</Col>
							</Row >
							<Row >
								<Col span="23" >
								<FormItem label="系统类型：" prop="sysName">
									<Checkbox v-model="add_menu.is4account">账号申请</Checkbox>
									<Checkbox v-model="add_menu.is4net">网络策略</Checkbox>
									<Checkbox v-model="add_menu.is4paas">入驻工单/PaaS</Checkbox>
									<Checkbox v-model="add_menu.is4resource">关联资源/PaaS</Checkbox>
									<Checkbox v-model="add_menu.is4superAcc">最高权限申请</Checkbox>
								</FormItem>
								</Col>
							</Row >
							<Row>
								<Col span="23"  >
								<FormItem label="可配置账号类型：">
									<CheckboxGroup v-model="add_menu.accountTypes" @on-change="selectAccountTypes">
										<template v-for="(item,index) in accountList">
											<Checkbox :label="item">
												<span>{{item}}</span>
											</Checkbox>
										</template>
									</CheckboxGroup>
								</FormItem>
								</Col>
							</Row>
							<Row>
								<Col span="14" >
								<FormItem label="系统归属部门：" prop="depId">
									<Select v-model="add_menu.depId"  filterable>
										<Option v-for="item in depList" :value="item.id" :key="item.id">{{item.depName}}</Option>
									</Select>
								</FormItem>
								</Col>
							</Row>
							<Row>
								<Col span="14" >
								<FormItem label="平台负责人：" prop="users">
									<component ref="inputSearch1" :dataList="amlabelList" :checkLable="add_menu.amlabel" :is="'inputSearch'"
									  :multiple="false" @on-change="checkamlabel"></component>
								</FormItem>
								</Col>
							</Row>
							<Row>
								<Col span="14" >
								<FormItem label="业务负责人：">
									<component ref="inputSearch2" :dataList="labelList" :checkLable="add_menu.label" :is="'inputSearch'"
									  :multiple="false" @on-change="checklabel"></component>
								</FormItem>
								</Col>
							</Row>
							<Row>
								<Col span="14" >
								<FormItem label="数据库账号管理员：">
									<component ref="inputSearch3" :dataList="dblabelList" :checkLable="add_menu.dblabel" :is="'inputSearch'"
									  :multiple="false" @on-change="checkdblabel"></component>
								</FormItem>
								</Col>
							</Row>
							<Row>
								<Col span="14" >
								<FormItem label="主机账号管理员：">
									<component ref="inputSearch4" :dataList="serverlabelList" :checkLable="add_menu.serverlabel" :is="'inputSearch'"
									  :multiple="false" @on-change="checkserverlabel"></component>
								</FormItem>
								</Col>
							</Row>
							<Row>
								<Col span="14" >
								<FormItem label="hadoop账号管理员：">
									<component ref="inputSearch5" :dataList="hadooplabelList" :checkLable="add_menu.hadooplabel" :is="'inputSearch'"
									  :multiple="false" @on-change="checkhadooplabel"></component>
								</FormItem>
								</Col>
							</Row>
							<Row >
								<Col span="23">
								<FormItem label="系统描述：" prop="des">
									<Input v-model="add_menu.des" type="textarea" :rows="3" :maxlength="255" show-word-limit style="width:97%" />
								</FormItem>

								</Col>
							</Row >
						</Form>
					</Modal>
				</div>

			</div>
		</template>
	</div>
</template>

<script>
	import expandRow from '../comp_user/user_expand'
	import usermain from "../comp_user/user_main"
	import mpage from "../comp_chatter/mpage"
	import pheader from "../comp_chatter/pheader"
	import mheader from "../comp_chatter/mheader"
	import mcontainer from "../comp_chatter/mcontainer"
	import Axios from 'axios'
	import ajax from "../ajax_util"
	import md5 from 'js-md5'
	import inputSearch from '../base/input_search'

	export default {
		components: {
			expandRow,
			usermain,
			mpage,
			mheader,
			mcontainer,
			pheader,
			inputSearch
		},
		data() {
			const validateUser_number = (rule, value, callback) => {
				this.right.user_number_right = -1;
				this.repetition.user_number_repetition = -1;
				let reg = /^[A-Za-z0-9]{6,20}$/;
				if (value === '') {
					callback(new Error('请输入用户账号.'));
				} else if ((!this.add_menu.isupdate) || (this.add_menu.isupdate && this.ifNumber)) {
					console.log("----!!!----------", this.add_menu.isupdate, this.ifNumber);
					if (!reg.test(value)) {
						this.right.user_number_right = 1;
						callback(new Error('用户账号格式不规范!'));
					} else {
						for (var i = 0; i < this.user_numberList.length; i++) {
							if (value === this.user_numberList[i]) {
								this.repetition.user_number_repetition = 1;
								callback(new Error('该用户账号已存在!'));
							}
						}
						callback();
					}
				} else {
					callback();
				}
			};
			const validateId_card = (rule, value, callback) => {
				this.repetition.id_card_repetition = -1;
				if (value === '') {
					callback(new Error('请输入身份证号.'));
				} else if ((!this.add_menu.isupdate) || (this.add_menu.isupdate && this.ifIdcard)) {
					for (var i = 0; i < this.id_cardList.length; i++) {
						if (value === this.id_cardList[i]) {
							this.repetition.id_card_repetition = 1;
							callback(new Error('该身份证号已被注册!'));
						}
					}
					callback();
				} else {
					callback();
				}
			};
			const validatePhone = (rule, value, callback) => {
				this.repetition.phone_repetition = -1;
				if (value === '') {
					callback(new Error('请输入电话号码.'));
				} else if ((!this.add_menu.isupdate) || (this.add_menu.isupdate && this.ifPhone)) {
					for (var i = 0; i < this.phoneList.length; i++) {
						if (value === this.phoneList[i]) {
							this.repetition.phone_repetition = 1;
							callback(new Error('该电话号码已被注册!'));
						}
					}
					callback();
				} else {
					callback();
				}
			};
			const validateEmail = (rule, value, callback) => {
				this.repetition.email_repetition = -1;
				if (value === '') {
					callback(new Error('请输入个人邮箱.'));
				} else if ((!this.add_menu.isupdate) || (this.add_menu.isupdate && this.ifEmail)) {
					for (var i = 0; i < this.emailList.length; i++) {
						if (value === this.emailList[i]) {
							this.repetition.email_repetition = 1;
							callback(new Error('该邮箱已被注册!'));
						}
					}
					callback();
				} else {
					callback();
				}
			};
			const validatePassword = (rule, value, callback) => {
				this.right.password_right = -1;
				let reg = /^[a-zA-Z]\w{5,17}$/;
				if (value === '') {
					callback(new Error('请输入账号密码!'));
				} else {
					if (!reg.test(value)) {
						this.right.password_right = 1;
						callback(new Error('密码格式不规范!'));
					}
					callback();
				}
			};
			return {
				is4account:'',
				is4net:'',
				is4paas:'',
				is4resource:'',
				is4superAcc:'',
				ruleInline: {
					sysName: [{
						required: true,
						message: '请输入系统名称.',
						trigger: 'blur'
					}],
					des: [{
						required: true,
						message: '请输入系统描述.',
						trigger: 'blur'
					}],
					users: [{
						required: true,
						message: '请选择需要关联的用户.',
						trigger: 'blur'
					}],
					depId: [{
						required: true,
						message: '请选择系统归属部门.',
						trigger: 'blur'
					}]
				},
				imageUrl: this.CONFIG.file_url,
				sysmapUrl: this.CONFIG.progress_url + "/system-map",
				depUrl: this.CONFIG.progress_url + "/business-dep",

				add_menu: {
					depId:'',
					depName:'',
					id: "",
					show: false,
					isupdate: false,
					updateId: -1,
					is4account: false,
					is4net: false,
					is4paas: false,
					is4resource: false,
					is4superAcc: false,
					sysName: "",
					des: "",

					amUser: {},
					businessUser: {},
					dbAmUser: {},
					hadoopAmUser: {},
					serverAmUser: {},

					label: "",
					amlabel: "",
					dblabel: "",
					hadooplabel: "",
					serverlabel: "",
					accountTypes: []

				},
				editIndex: "", //编辑的信息下标
				amlabelList: [],
				labelList: [],
				dblabelList: [],
				serverlabelList: [],
				hadooplabelList: [],
				depList:[],

				sysIsList: [{
						"Type": 'account',
						"name": "账号申请"
					},
					{
						"Type": 'net',
						"name": "网络策略"
					},
					{
						"Type": 'paas',
						"name": "入驻工单/PaaS"
					},
					{
						"Type": 'resource',
						"name": "关联资源/PaaS"
					},
					{
						"Type": 'superAcc',
						"name": "最高权限申请"
					},
				],
				checkType: "",
				countSys: [],
				total_num: 0,
				userList: [],
				amlabelList: [],
				labelList: [],
				dblabelList: [],
				serverlabelList: [],
				hadooplabelList: [],
				sysNameList: [],
				desList: [],
				sysmapList: [],
				pwdModal: {
					id: -1,
					show: false,
					old_password: "",
					password: ""
				},

				loading: true,
				data: [],
				showdata: [],

				user_numberList: [],
				phoneList: [],
				emailList: [],
				repetition: {
					user_number_repetition: -1,
					phone_repetition: -1,
					email_repetition: -1,
					id_card_repetition: -1
				},
				right: {
					user_number_right: -1,
					password_right: -1
				},
				id_cardList: [],
				roleList: [],

				list01: [],
				list02: [],

				page: 1,
				pageSize: 10,
				search_param: '',
				countUser: [],
				url_id: '0',

				visible: false,
				httpHeader: {
					Authorization: this.$store.state.token
				},

				temp_number: "",
				temp_id_card: "",
				temp_phone: "",
				temp_email: "",
				ifNumber: false,
				ifIdcard: false,
				ifPhone: false,
				ifEmail: false,
				accountList: ["主机账号", "数据库账号", "Hadoop账号", "UAP账号", "PaaS门户账号", "DACP账号", "其他权限内容"]
			}
		},
		computed: {
			columns() {
				let columns = [];
				columns.push({
					title: '序号',
					type: 'index',
					width: 80,
					align: 'center',
					render: (h, params) => {
						return h('span', params.index + (this.page - 1) * this.pageSize + 1);
					}
				});
				columns.push({
					title: '系统名称',
					key: 'sysName',
					align: 'center',
					minWidth: 200,
					maxWidth: 200
				});
				columns.push({
					title: '系统功能',
					slot: "sysIs",
					align: 'center',
					minWidth: 200,
					maxWidth: 200
				});
				columns.push({
					title: '系统描述',
					key: 'des',
					align: 'center',
					minWidth: 200
				});
				columns.push({
					title: '系统归属部门',
					align: 'center',
					slot: 'depId',
					minWidth: 100
				});
				columns.push({
					title: '平台负责人',
					align: 'center',
					slot: 'amUser',
					minWidth: 100
				});
				columns.push({
					title: '业务负责人',
					align: 'center',
					slot: 'businessUser',
					minWidth: 100
				});
				columns.push({
					title: '数据库账号管理员',
					align: 'center',
					slot: 'dbAmUser',
					minWidth: 100
				});
				columns.push({
					title: '主机账号管理员',
					align: 'center',
					slot: 'serverAmUser',
					minWidth: 100
				});
				columns.push({
					title: 'hadoop账号管理员',
					align: 'center',
					slot: 'hadoopAmUser',
					minWidth: 100
				});
				if (this.$hasPerm('sysEdit') || this.$hasPerm('sysMove')) {
					columns.push({
						title: '操作',
						key: 'action',
						width: 160,
						align: 'center',
						fixed: 'right',
						render: (h, params) => {
							let button = [];
							if (this.$hasPerm('sysEdit')) {
								button.push(
									h('Button', {
										props: {
											type: 'primary',
											size: 'small'
										},
										style: {
											marginRight: '5px'
										},
										on: {
											click: () => {
												this.edit(params)
											}
										}
									}, '编辑')
								);
							}
							if (this.$hasPerm('sysMove')) {
								button.push(
									h('Button', {
										props: {
											type: 'error',
											size: 'small'
										},
										on: {
											click: () => {
												this.delete(params.row.id)
											}
										}
									}, '删除')
								);
							}
							return h('div', button);
						}
					});
				}
				return columns;
			}
		},
		mounted() {
			this.get_all_sys();
			this.get_all_dep();
		},
		methods: {
			selectAccountTypes(data) {
				console.log("======selectAccountTypes====", data, this.add_menu.accountTypes);
			},

			searchType(checkType){
				this.is4account = ''
				this.is4net = ''
				this.is4paas = ''
				this.is4resource = ''
				this.is4superAcc = ''
				console.log("checkType",checkType)
				if (checkType === 'account') {
					this.is4account = 1
				}
				if (checkType === 'net') {
					this.is4net = 1
				}
				if (checkType === 'superAcc') {
					this.is4superAcc = 1
				}
				if (checkType === 'paas') {
					this.is4paas = 1
				}
				if (checkType === 'resource') {
					this.is4resource = 1
				}

			},
			searchType(checkType){
				console.log("checkType",checkType)
				var that = this;
				var url = that.sysmapUrl + "/for/" + checkType;
				ajax.get({
					url: url,
					that: that,
					success: function(data) {
						console.log('checkType__:', data)
						that.data = data
						that.total_num = data.length
						//that.countSys = data
						//that.get_sys_user(data)
						//sessionStorage.setItem("url_id", "0");
						//that.changePage();
					}
				})

			},
			changePage(page) {
				console.log('page', Object.prototype.toString.call(page) == '[object Number]')
				var that = this;
				if (page != undefined && page > 0 && page != null && Object.prototype.toString.call(page) === '[object Number]') {
					that.page = page;
				} else {
					that.page = 1;
				}
				var param = {
					current: that.page,
					pageSize: that.pageSize,
					sysName: this.search_param,
					is4account:this.is4account,
					is4net:this.is4net,
					is4paas:this.is4paas,
					is4resource:this.is4resource,
					is4superAcc:this.is4superAcc,
				}
				console.log('param:',param)
				var url = this.sysmapUrl + '/page';
				ajax.get({
					url: url,
					that: that,
					params: param,
					success: function(data) {
						console.log('changePage_data', data)
						that.data = data['records'];
						that.total_num = data['total'];
					}
				})
			},

			changePageSize(pageSize) {
				this.pageSize = pageSize;
				this.url_id = sessionStorage.getItem("url_id")
				if (this.url_id === "0") {
					this.get_all_sys();
				} else if (this.url_id === "1") {
					var param = sessionStorage.getItem("param");
					this.search(param);
				}
			},

			get_all_dep(){
				var that = this;
				var url = that.depUrl + "/names";
				ajax.get({
					url: url,
					that: that,
					success: function(data) {
						console.log('get_all_dap:', data)
						that.depList = data['records']
					}
				})
			},
			get_all_user() {
				var that = this;
				var url = this.CONFIG.url_know + '/users';
				ajax.get({
					url: url,
					that: that,
					success: function(data) {
						console.log('get_all_user:', data)
						that.userList = []
						for (var i = 0; i < data.length; i++) {
							var j = {};
							j.id = data[i].id;
							j.user_name = data[i].user_name;
							that.userList.push(j);
						}

					}
				})
			},

			get_all_sys() {
				var that = this;
				var url = that.sysmapUrl + "/names";
				ajax.get({
					url: url,
					that: that,
					success: function(data) {
						console.log('get_all_sys:', data)
						//that.data = data
						that.countSys = data
						//that.get_sys_user(data)
						sessionStorage.setItem("url_id", "0");
						that.changePage();
					}
				})
			},

			get_all_role() {
				var that = this;
				var url = this.CONFIG.url_know + '/roles';

				ajax.get({
					url: url,
					that: that,
					success: function(data) {
						that.roleList = [];
						for (var i = 0; i < data.length; i++) {
							var j = {};
							j.id = data[i].id;
							j.role_name = data[i].role_name;
							that.roleList.push(j);
						}
					}
				})
			},

			messageWarningFn(text) {
				this.$Message.warning(text)
				setTimeout(() => {
					this.loading = false
					this.$nextTick(() => {
						this.loading = true
					});
				}, 1);
			},
			cancel(name) {
				this.$refs[name].resetFields();
				this.ifNumber = false;
				this.ifIdcard = false;
				this.ifPhone = false;
				this.ifEmail = false;
			},

			checkamlabel(list) {
				this.amlabelList = list
				list.forEach(item => {
					this.add_menu.amlabel = item.id
					this.add_menu.amUser.user_name = item.user_name
				})
			},
			checklabel(list) {
				this.labelList = list
				list.forEach(item => {
					this.add_menu.label = item.id
					this.add_menu.businessUser.user_name = item.user_name
				})
			},
			checkdblabel(list) {
				this.dblabelList = list
				list.forEach(item => {
					this.add_menu.dblabel = item.id
					this.add_menu.dbAmUser.user_name = item.user_name
				})
			},
			checkserverlabel(list) {
				this.serverlabelList = list
				list.forEach(item => {
					this.add_menu.serverlabel = item.id
					this.add_menu.serverAmUser.user_name = item.user_name
				})
			},
			checkhadooplabel(list) {
				this.hadooplabelList = list
				list.forEach(item => {
					this.add_menu.hadooplabel = item.id
					this.add_menu.hadoopAmUser.user_name = item.user_name
				})
			},

			add_ok() {
				var that = this;
				if (this.add_menu.sysName === '') {
					this.messageWarningFn('系统名称不能为空');
					return
				} else if (this.add_menu.amlabel.length == 0 || this.add_menu.amlabel == null || this.add_menu.amlabel ===
					undefined) {
					this.messageWarningFn('平台负责人不能为空!');
					return
				} else if (this.add_menu.depId === '') {
					this.messageWarningFn('归属部门不能为空');
					return
				} else if (this.add_menu.des === '') {
					this.messageWarningFn('系统描述不能为空');
					return
				} else {
					var url = that.sysmapUrl
					console.log("addd---->", that.add_menu, that.add_menu.is4account ? 1 : 0, )
					let sys = {
						des: that.add_menu.des,
						sysName: that.add_menu.sysName,
						depId:that.add_menu.depId,
						is4account: that.add_menu.is4account ? 1 : 0,
						is4net: that.add_menu.is4net ? 1 : 0,
						is4paas: that.add_menu.is4paas ? 1 : 0,
						is4resource: that.add_menu.is4resource ? 1 : 0,
						is4superAcc: that.add_menu.is4superAcc ? 1 : 0,
						accountTypes: that.add_menu.accountTypes,
					};
					if (that.add_menu.isupdate) { //说明是修改，不是新增
						console.log('修改：', that.add_menu)
						sys['id'] = that.add_menu.id,
							sys['amId'] = that.add_menu.amlabel
						if (that.add_menu.label != "" && that.add_menu.label != undefined) {
							sys['businessUserId'] = that.add_menu.label
						} else {
							sys['businessUserId'] = that.add_menu.amlabel
						};
						if (that.add_menu.dblabel != "" && that.add_menu.dblabel != undefined) {
							sys['dbAmId'] = that.add_menu.dblabel
						} else {
							sys['dbAmId'] = that.add_menu.amlabel
						};
						if (that.add_menu.serverlabel != "" && that.add_menu.serverlabel != undefined) {
							sys['serverAmId'] = that.add_menu.serverlabel
						} else {
							sys['serverAmId'] = that.add_menu.amlabel
						};
						if (that.add_menu.hadooplabel != "" && that.add_menu.hadooplabel != undefined) {
							sys['hadoopAmId'] = that.add_menu.hadooplabel
						} else {
							sys['hadoopAmId'] = that.add_menu.amlabel
						};

						console.log('sys', sys)
						ajax.put({
							url: url,
							that: that,
							data: sys,
							success: function(data) {
								that.get_all_sys();
								that.$Notice.success({
									title: '成功修改系统'
								});
								that.add_menu.show = false;
							}
						})
					} else { //说明是新增
						console.log('新增：', that.add_menu)
						//sys['businessUserId'] = that.add_menu.label
						sys['amId'] = that.add_menu.amlabel
						if (that.add_menu.label != "" && that.add_menu.label != undefined) {
							sys['businessUserId'] = that.add_menu.label
						} else {
							sys['businessUserId'] = that.add_menu.amlabel
						};
						if (that.add_menu.dblabel != "" && that.add_menu.dblabel != undefined) {
							sys['dbAmId'] = that.add_menu.dblabel
						} else {
							sys['dbAmId'] = that.add_menu.amlabel
						};
						if (that.add_menu.serverlabel != "" && that.add_menu.serverlabel != undefined) {
							sys['serverAmId'] = that.add_menu.serverlabel
						} else {
							sys['serverAmId'] = that.add_menu.amlabel
						};
						if (that.add_menu.hadooplabel != "" && that.add_menu.hadooplabel != undefined) {
							sys['hadoopAmId'] = that.add_menu.hadooplabel
						} else {
							sys['hadoopAmId'] = that.add_menu.amlabel
						};
						console.log('sys', sys)
						ajax.post({
							url: url,
							that: that,
							data: sys,
							success: function(data) {
								that.get_all_sys();
								that.$Notice.success({
									title: '成功新建系统'
								});
								that.add_menu.show = false;
								that.ifNumber = false;
								that.ifIdcard = false;
								that.ifPhone = false;
								that.ifEmail = false;
							}
						})
					}
				}
			},
			add() {
				this.add_menu.is4account = false;
				this.add_menu.is4net = false;
				this.add_menu.is4paas = false;
				this.add_menu.is4resource = false;
				this.add_menu.is4superAcc = false;

				this.add_menu.isupdate = false;
				this.add_menu.show = true;
				this.add_menu.label = "";
				this.add_menu.amlabel = "";
				this.add_menu.dblabel = "";
				this.add_menu.hadooplabel = "";
				this.add_menu.serverlabel = "";
				this.add_menu.sysName = "";
				this.add_menu.des = "";
				this.add_menu.depId = '';

				this.add_menu.amUser = {};
				this.add_menu.businessUser = {};
				this.add_menu.dbAmUser = {};
				this.add_menu.hadoopAmUser = {};
				this.add_menu.serverAmUser = {};
				this.add_menu.accountTypes = [];
				this.amlabelList = []
				this.labelList = []
				this.dblabelList = []
				this.serverlabelList = []
				this.hadooplabelList = []
			},
			edit(params) {
				console.log("params---->", params)
				var t = JSON.stringify(params)
				var temp = JSON.parse(t)
				this.add_menu.depId = temp.row.depId
				this.add_menu.sysName = temp.row.sysName
				this.add_menu.des = temp.row.des

				this.add_menu.is4account = temp.row.is4account == 1;;
				this.add_menu.is4net = temp.row.is4net == 1;
				this.add_menu.is4paas = temp.row.is4paas == 1;
				this.add_menu.is4resource = temp.row.is4resource == 1;
				this.add_menu.is4superAcc = temp.row.is4superAcc == 1;

				if (temp.row.accountTypes == undefined || temp.row.accountTypes == null) {
					this.add_menu.accountTypes = [];
				} else {
					this.add_menu.accountTypes = temp.row.accountTypes;
				}

				if (temp.row.amUser != undefined && temp.row.amUser != null) {
					this.add_menu.amlabel = temp.row.amUser.id
					this.amlabelList = [temp.row.amUser]
				}

				if (temp.row.businessUser != undefined && temp.row.businessUser != null) {
					this.add_menu.label = temp.row.businessUser.id
					this.labelList = [temp.row.businessUser]
				} else {
					this.add_menu.label = ""
					this.labelList = []
				}
				if (temp.row.dbAmUser != undefined && temp.row.dbAmUser != null) {
					this.add_menu.dblabel = temp.row.dbAmUser.id
					this.dblabelList = [temp.row.dbAmUser]
				} else {
					this.add_menu.dblabel = ""
					this.dblabelList = []
				}
				if (temp.row.hadoopAmUser != undefined && temp.row.hadoopAmUser != null) {
					this.add_menu.hadooplabel = temp.row.hadoopAmUser.id
					this.hadooplabelList = [temp.row.hadoopAmUser]
				} else {
					this.add_menu.hadooplabel = ""
					this.hadooplabelList = []
				}
				if (temp.row.serverAmUser != undefined && temp.row.serverAmUser != null) {
					this.add_menu.serverlabel = temp.row.serverAmUser.id
					this.serverlabelList = [temp.row.serverAmUser]
				} else {
					this.add_menu.serverlabel = ""
					this.serverlabelList = []
				}
				this.add_menu.id = temp.row.id
				this.editIndex = temp.index

				this.add_menu.isupdate = true
				this.add_menu.show = true;
			},
			delete(id) {
				console.log('delete_id', id)
				this.$Modal.confirm({
					title: '确定删除该系统？',
					width: '360',
					onOk: () => {
						this.del(id)
					}
				});
			},
			del(id) {
				sessionStorage.setItem("delete", "true");
				var that = this;
				var url = that.sysmapUrl + '/' + id;
				ajax.del({
					url: url,
					that: that,
					success: function() {
						that.url_id = sessionStorage.getItem("url_id")
						if (that.url_id === "0") {
							that.get_all_sys();
						} else if (that.url_id === "1") {
							var param = sessionStorage.getItem("param");
							that.search(param);
						}

						if (that.data.length === 1 && that.page > 1) {
							var pageTemp = that.page - 1;
						}
						that.changePage(pageTemp);

						that.$Notice.success({
							title: '成功删除系统配置'
						});
					}
				});
			},
			search(param) {
				if (param === '') {} else {
					this.changePage(1)
				}
			},
		}
	}
</script>

<style>
	.demo-upload-list {
		display: inline-block;
		width: 60px;
		height: 60px;
		text-align: center;
		line-height: 60px;
		border: 1px solid transparent;
		border-radius: 4px;
		overflow: hidden;
		background: #fff;
		position: relative;
		box-shadow: 0 1px 1px rgba(0, 0, 0, .2);
		margin-right: 4px;
	}

	.demo-upload-list img {
		width: 100%;
		height: 100%;
	}

	.demo-upload-list-cover {
		display: none;
		position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		background: rgba(0, 0, 0, .6);
	}

	.demo-upload-list:hover .demo-upload-list-cover {
		display: block;
	}

	.demo-upload-list-cover i {
		color: #fff;
		font-size: 20px;
		cursor: pointer;
		margin: 0 2px;
	}
</style>
